<!doctype html>
<html lang="en">
<head>
  <script  src='./jquery-3.2.1.min.js'></script>
  <meta http-equiv="Content-Type" Content='text/html'; charset="UTF-8">
  <title>批量绑定事件</title>
</head>
  <style>
    div {width:300px; height: 200px; background-color: lightpink} 
  </style>
  <script>
    $(function(){

     $('div').bind({
       'click':function(){ $(this).css('font-size','40px') },
       'mouseover':function(){$(this).css('background-color','lightblue') },
       'mouseout' :function(){ $(this).css('background-color','pink') }
     }); 
     });

  </script>
<body>
   <h2>事件绑定</h2>
   <div>
     This is Friday!!!
   </div>
   <input type="button" value="触发" onclick="f1()">	
</body>
</html>